<extend name="./common" />
<block name="css">
<style type="text/css">
.times {display:block;margin:15px 0;}
.times ul {margin-left:25px;border-left:2px solid #ddd;}
.times ul li {width:100%;margin-left:-12px;line-height:20px;font-weight:narmal;}
.times ul li b {width:8px;height:8px;background:#fff;border:2px solid #555;margin:7px;border-radius:6px;-webkit-border-radius:6px;-moz-border-radius:6px;overflow:hidden;display:inline-block;float:left;}
.times ul li span {padding-left:7px;font-size:13px;line-height:20px;color:#555;}
.times ul li:hover b {border:2px solid #ff6600;}
.times ul li:hover span {color:#ff6600;}
.times ul li:hover p {color:#ff6600;}
.times ul li:hover  {color:#ff6600;}
.times ul li p {padding-left:15px;font-size:14px;line-height:25px;}
.gitAvatar{width: 36px;height: 36px;border-radius: 50% 50%;cursor: pointer;-webkit-transition: .5s;transition: .5s;}
  .gitAvatar:hover{transform: rotateZ(360deg)}
</style>
</block>
  <block name="content">
     <div class="content-wrap"><!--内容-->
    <div class="content">
      <div class="content-block about-content">
        <h2 class="title"><strong>{$title}</strong></h2>
      </div>
      <p>数据来源GitOSChina</p>
      <div class="times">
          <ul id="commits235">

          </ul>
      </div>
      <span style="display: none" id="nextpage">1</span>
    </div>
  </div>

  </block>

  <block name='js'>
    <script type="text/javascript">
    function getDateTime(timestamp) {
      var date = new Date(timestamp);
      Y = date.getFullYear() + '-';
      M = (date.getMonth()+1 < 10 ? '0'+(date.getMonth()+1) : date.getMonth()+1) + '-';
      D = (date.getDate()<10?'0' +date.getDate():date.getDate())+ ' ';
      h = (date.getHours()<10?'0'+date.getHours():date.getHours()) + ':';
      m = (date.getMinutes()<10?'0'+date.getMinutes():date.getMinutes()) + ':';
      s = (date.getSeconds()<10?'0'+date.getSeconds():date.getSeconds());
      return Y+M+D+h+m+s;
    }
    $(function() {
      next(1);
    });
    $(window).scroll(function(){
      var scrollTop = $(this).scrollTop();    //滚动条距离顶部的高度
      var scrollHeight = $(document).height();   //当前页面的总高度
      var clientHeight = $(this).height();    //当前可视的页面高度
      if(scrollTop + clientHeight >= scrollHeight){ 
        /*翻页*/
        var page=$('#nextpage').text();
        next(page);
      }else if(scrollTop<=0){ 

      }
    });
    flag=true;
    function next (p){
      if(!flag){
        return false;
      }
      if(p!=1){
        layer.load(2);
      }
      var _url = window.location+'?p='+p;
      $('#nextpage').text(parseInt(p)+1);
      jQuery.ajax({
        type : "POST",
        url : _url,
        success : function (data){
          if(JSON.stringify(data) === '[]' && flag){
            var foot='<hr><h5 style="text-align:center;color:#aaa">已经到底了</h5>';
            $(".times").append($(foot).fadeIn(400));
            flag=false;
          }
          html='';
          $.each(data,function(i,item){
            html+='<li><b></b><img class="gitAvatar" src="'+item.committer.avatar_url+'"/> '+item.commit.commiter.name+'：<span>'+getDateTime(item.commit.commiter.date)+'</span><p> '+item.commit.message+'，影响行数: '+item.stats.additions+'+ '+item.stats.deletions+'-</p></li><hr>';
          })
          $("#commits235").append($(html).fadeIn(300));
          layer.closeAll();
        }
      });
    }
    </script>
  </block>